<template>
	<div id="box">
		<h2>{{editData.name}}</h2>
		<el-form :model="editData" ref='child' :rules='rules'>
			<el-row :gutter="20">
  			<el-col :span="8" :offset="8">
  				<el-form-item label="备注:" prop='remark'>
				<el-input :maxlength='80' style="width: 300px" type="textarea" :rows="2" placeholder="请输入备注信息" v-model="editData.remark"></el-input>
				</el-form-item>
				<el-form-item label="部门:" prop="store_name" style='width:460px' >
				<el-select v-model="editData.store_name" placeholder="选择部门">
				<el-option v-for='(item,index) in storeSelect' :label="item" :value="item" :key='index'></el-option>
				</el-select>
				</el-form-item>
				<el-form-item>
				<el-button type="primary" @click="submitForm('child')">确认修改</el-button>
				<el-button @click="resetForm('child')">重置</el-button>
				</el-form-item>
  			</el-col>
			</el-row>
		</el-form>
	</div>
</template>

<script>
	import {mapGetters,mapActions,mapState} from 'vuex'
	export default{
		name:'jobEdit',
		props:['editData'],
		data(){
			return {
				rules:{},
			}
		},
		computed:{
			...mapGetters(['storeSelect']),
			// gudingData(){
			// 	let obj = {}
			// 	for(let key in this.editData){
			// 		obj[key] = this.editData[key]
			// 	}
			// 	return obj
			// }
		},
		methods:{
			...mapActions(['editJob','actGetSelectData']),
			submitForm(formName) {
        		this.$refs[formName].validate((valid) => {
          			if (valid) {
          				//发起请求 判断 数据库更新是否成功
          				console.log(this.storeSelect)
          				let {name,remark,store_name} = this.editData
          				let obj ={
          					name:name,
          					remark:remark,
          					update_by:sessionStorage.getItem('id'),
          					store_name:store_name
          				}
          				this.editJob(obj).then(res=>{
          					if(res === '200'){
          						this.$emit('text',this.editData)
          					}
          				})
          			} else {
            			console.log('error submit!!');
            			return false;
          			}
        		});
      		},
      		resetForm(formName) {
      			// this.editData = this.gudingData 重置问题
        		this.$refs[formName].resetFields();
      		}
		},
		created(){
			this.actGetSelectData()
		}
	}
</script>